<template>
    <div class="diskInfoWrap">
        <div class="head">
            <p class="colCLas"></p>
            <p class="info">数电发票模块</p>
        </div>

        <el-form
            :inline="true"
            :model="searchParams"
            style="width: 100%"
            size="small"
            class="formInline"
        >
            <el-select
                style="width: 160px"
                v-model="searchParams.select1"
                placeholder="请选择"
                size="small"
                @change="getList"
            >
                <el-option label="我的已办" value="1"></el-option>
                <el-option label="我的待办" value="0"></el-option>
            </el-select>
            <el-form-item
                label="流程类型："
                style="max-width: 440px; margin-left: 8px"
            >
                <el-select
                    style="width: 160px"
                    v-model="searchParams.select2"
                    placeholder="请选择"
                    clearable
                >
                <el-option v-for="item in dictList" :key="item.lxxdm" :label="item.lxxmc" :value="item.lxxdm"></el-option>
                </el-select>
            </el-form-item>
            <el-input
                style="width: 240px"
                v-model="searchParams.input2"
                placeholder="请输入流程编号"
                size="small"
            ></el-input>

            <el-form-item style="margin-left: 8px">
                <el-button type="primary" @click="getList">查询</el-button>
            </el-form-item>
        </el-form>

        <tableList
            :showIndex="true"
            border
            heightMin='80'
            :keySet="keySet"
            :autoHeight="true"
            :tableData="listDetails"
            :paginationShow="true"
            :pageNumber="pages.current"
            :pageSize="pages.size"
            :total="pages.total"
            @handleSizeChange="handleSizeChange"
            @handleCurrentChange="handleCurrentChange"
            :handlerShow="true"
            handlerShowWidth="80"
            handlerFixed="right"
        >
            <template #handler="{ row }">
                <div
                    v-if="searchParams.select1 == 0"
                    v-on:click="handlerClick(row)"
                    class="worldBlueBtn"
                >
                    办理
                </div>
                <div v-on:click="handlerClick(row,'look')" v-if="searchParams.select1 == 1"  class="worldBlueBtn">
                    查看
                </div>
            </template>
        </tableList>
    </div>
</template>

<script>
import { getDefBIzdictByLxdm } from '@/api/system.js'
import mixinTable from '@/mixin/mtable.js'
import getHistory from '../baseInfo/components/getHistory.vue'
import tableList from '@/components/tableList/index.vue'

import sqxx from './flowNew/StartProcess1.vue'
import fpxx from './flowNew/InvoiceInfo2.vue'
import shgj from './flowNew/ProcessTrack4.vue'
import jbxx from './flowNew/BaseInfo5.vue'
import shyj from './flowNew/ProcessAdvice6.vue'

import defaultConfig from '@/utils/config.js'

export default {
    name: 'homePage',
    mixins: [mixinTable],
    data() {
        return {
            timer:null,
            dictList:[],

            listDetails: [],
            keySet: [
                {
                    label: '流程类型',
                    englishName: 'busTypeName',
                    width: '100'
                },
                {
                    label: '流程名称',
                    englishName: 'busName',
                },
                {
                    label: '流程编号',
                    englishName: 'busCode',
                },
                {
                    label: '流程状态',
                    englishName: 'businessStatusText',
                },
                {
                    label: '当前处理环节',
                    englishName: 'currentActivityName',
                    width: 'labelWidth',
                },
                {
                    label: '当前处理人员',
                    englishName: 'currentAssignee',
                    width: 'labelWidth',
                },
                {
                    label: '当前处理人员岗位',
                    width: 'labelWidth',
                    englishName: 'roleNames',
                },
                {
                    label: '发起人',
                    englishName: 'createdBy',
                },
                {
                    label: '申请时间',
                    englishName: 'createdTime',
                    width: 150
                },
            ],
            activeComNumber: '0',
        }
    },
    created() {
        this.searchParams.select1 = '0';
        this.getDict()
        this.getList();

    },
    mounted() {
        this.addEvent()
    },
    methods: {
        addEvent(){
            let that = this;
            window.addEventListener(
            'message',
            function (event) {
                if (event.origin === defaultConfig.eventOriginPath) {
                    const data = event.data;
                    if(data.type == '03'){
                        that.getList()
                    }
                }
            },
            false
        )

        },
        getDict() {
            getDefBIzdictByLxdm(
                {
                    lxdm: 'VMS_WORK_FLOW_TYPE'
                }
            ).then(
                ({ data }) => {
                    this.dictList = data
                },
                (err) => {
                }
            )
        },
        handlerClick(val,isLook ) {
            
            this.activeComNumber = this.transformFn(val)
            sessionStorage.setItem(
                // flowType,
                'handleDetailInfo',
                JSON.stringify({
                    activeComNumber: this.activeComNumber,
                    titleInfo:isLook == 'look'?'查看' : '办理发票',
                    searchParams: this.searchParams,
                    isLook: isLook == 'look' , // 待使用
                    processId:val.id,
                    busId:val.id,
                    busType:val.busType,
                    busStatus:val.busStatus,

                    nodeId:val.currentActivity,
                    templateId:val.templateId,
                    procInstId:val.procInstId,
                })
            )

            window.parent.postMessage({
                type: '01',
                params: {
                    url: '/handleDetail',
                    width: 1000,
                    height: 800,
                    title: isLook == 'look'?'查看' : '办理',
                    windowId: 'handleDetail',
                    activeComNumber: this.activeComNumber,
                },
            }, '*')



/*             setTimeout(()=>{
                window.parent.postMessage(
          {
                type: '02',
                params: {
                    url: '/handleDetail',
                    width: 1000,
                    height: 800,
                    title: '测试hello',
                    windowId: 'handleDetail',
                    // windowId: 'hello',
                    // callBackFun: '22',
                }
            },
             '*'
             )
            },3000) */
        },
        transformFn(val){
            let res = '';
            let obj = {
                'SGKP': '1', // 手工开票 - 待提交、退回，保存未提交
                'root': '1', // 手工开票 - 待提交、退回，保存未提交
                'XZSXED': '6', // 下载授信额度 - 退回
                'THSXED': '9', // 退回 - 退回
                'YFMLY': '13', // 下载授信额度 - 退回

                'FLOW_SGKP': '4', // 退回
                'FLOW_SGKP_SP': '3', // 审批
                'FLOW_SGKP_KP': '2', // 手工开票

                'FLOW_XZSXED_SP': '5', // 下载授信额度——审批
                'FLOW_XZSXED_XZ': '7', // 下载授信额度——下载（待下载）
                'FLOW_XZSXED': '6', // 下载授信额度——退回 *

                'FLOW_THSXED_SP': '8', // 退回授信额度-审批
                'FLOW_THSXED': '9', // 退回授信额度-退回
                'FLOW_THSXED_THSX': '10', //

                'FLOW_YFMLY': '13', // 预赋码——退回
                'FLOW_YFMLY_SP': '11', // 
                'FLOW_YFMLY_LY': '12', // 

                "FLOW_HZQRDSQ": '17', // 红字申请开票的没保存
                "FLOW_HZQRDSQ_SP":"15", // 红字申请的审批

                "FLOW_HZQRDQR": '19', // 红字确认开票的没保存
                "FLOW_HZQRDQR_SP": '20', // 红字确认审核

            }
            if(val.busStatus == 1){ // doing, 
                // busStatus只是区分1, 2/3/6,4/5  区分状态
                // busType流程类型 用来区分是红字/手工等
                // currentActivity其实有部分状态的作用, root就是初始或者退回.
                // busType + currentActivity 用来判断不是手工, 并且状态不是root节点
                if(val.busType == "FLOW_HZQRDSQ" || val.busType == "FLOW_HZQRDQR"){ 
                    if(val.currentActivity != 'root'){
                        res= obj[val.currentActivity]
                    }else{
                        res = obj[val.busType] // 单纯类型的话,没法区分状态. 

                    }
                }else{
                    // 
                    res =   obj[val.currentActivity]
                }
                // if(val.busType == "FLOW_SGKP"){
                    
                // }else 
            }else if(val.busStatus == 2 || val.busStatus == 3 || val.busStatus == 6){ // 退回
                if(val.busType == "FLOW_HZQRDQR"){  // 退回逻辑 ,手工开票没审核轨迹. 无法统一. 所以单独处理
                    res = '21' // 
                }else if(val.busType == "FLOW_HZQRDSQ"){ // 退回逻辑 ,手工开票没审核轨迹. 无法统一. 所以单独处理
                    res  = '16'
                }else{
                    res  = obj[val.busType]
                }
            }else if(val.busStatus == 4 || val.busStatus == 5){ // 结束了, 查看或者终止
                if(val.busType == "FLOW_HZQRDQR"){ 
                    res = '22' // 查看
                }else if(val.busType == "FLOW_HZQRDSQ"){
                    res  =  "18"
                }else{
                    res  = obj[val.busType]
                }

            }
            return res


        },
        async fn () {
            this.$store.dispatch('invoice2/homeGetList',{
                "busCode": this.searchParams.input2,
                "busType": this.searchParams.select2,
                "isDone": this.searchParams.select1,
                pageNo: this.pages.current,
                pageSize: this.pages.size,
            }).then(({data,code})=>{
                if (code == 200) {
                this.listDetails = data.records
                this.pages.total = data.total
                this.pages.current = data.current
                this.pages.size = data.size
                } else {
                    this.$message({
                        type: 'success',
                        message: message,
                    })
                }
            })
        },
        async getList () {
            if(this.timer)return
            this.timer = setTimeout(()=>{
                this.fn()
                clearTimeout(this.timer)
                this.timer = null
            },500)
        }
    },
    components: {
        tableList,
        getHistory,
        fpxx,
        sqxx,
        shgj,
        jbxx,
        shyj,
    },
}
</script>

<style lang = "scss" scoped>
@import '@/style/variables.scss';
.diskInfoWrap {
    box-sizing: border-box;
    .head {
        display: flex;
        height: 18px;
        align-items: center;
        margin-bottom: 4px;
        .colCLas {
            width: 4px;
            height: 100%;
            background-color: $allBg;
            margin-right: 12px;
        }
        .info {
            height: 100%;
            display: flex;
            align-items: center;
        }
    }
}

.formInline :deep .el-form-item--small {
    margin-bottom: 4px;
}
</style>
